<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
        <title>Create a Question</title>
        <script language="javascript">
        var i = 0;
      //FUNCTION TO ADD TEXT BOX ELEMENT
        function addElement()
        {   
        	i++;
            var contentID = document.getElementById('content');
            var newTBDiv = document.createElement('div');
            newTBDiv.setAttribute('id','strText'+i);
            newTBDiv.innerHTML = "<input type='text' id='text" + i + "' value = 'text"+i+"' class='tb' name='" + i + "'/>";
            contentID.appendChild(newTBDiv);
        }
        //FUNCTION TO REMOVE TEXT BOX ELEMENT
        function removeElement()
        {
            if(i != 0)
            {
                var contentID = document.getElementById('content');
                contentID.removeChild(document.getElementById('strText'+i));
                i--;
            }
        }
        
		</script>
        <link rel="stylesheet" type="text/css" href="css/style.css" />
	 </head>
    <body>
        <form>
            <table width = "100%">
                <tr valign="top">
                <td align="center">
                    <h3>CSI5130 Clicker App</h3>
                </td>
               	</tr>
               	<tr>
                <td align="center">
                    What is the question type?
                </td>
                </tr>
				<tr>
                <td align="center">
                	<input type="radio" id="truefalse" name="questiontype" class="regular-radio" checked/><label for="truefalse">True/False</label>
        			<input type="radio" id="multiplechoice" name="questiontype" class="regular-radio" /><label for="multiplechoice">Multiple Choice</label><br />
                </tr>
                <tr>
                <td align="center">
                    What is the question text?
                </td>
                </tr>
                <tr>
                <td align="center">
                    <textarea name="qtext" id="informationId" rows="12" cols="26"></textarea>
                </td>
                </tr>
                <tr>
                <td align="center">
                    What are the possible answers?
                </td>
                </tr>
                <tr>
                <td align="center">
                	<input id="atext" type="text" class = "tb" value="text0">
                </td>
                <td align="center">
                	<button type=button style="border: 0; background: transparent">
                		<img src="images/plus.png" width="30" height="30" onclick="addElement()"/>
                	</button>
                	<button type=button style="border: 0; background: transparent">
                		<img src="images/minus.png" width="30" height="30" onclick="removeElement()"/>
                	</button>
                </td>
                </tr>
                <tr>
                <td align="center">
                	<div id="content"></div>
                </td>
                </tr>
                <tr>
                <td align="center">
                    <input type="radio" id="enabled" name="enabledisable" class="regular-radio" /><label for="enabled">Enable</label>
        			<input type="radio" id="disabled" name="enabledisable" class="regular-radio" checked/><label for="disabled">Disable</label><br />
                </td>
                </tr>
                <tr>
                <td align="center">
                	<br>
                	<a href="#" class="button_a">Submit</a>
                </td>
                </tr>
            </table>
        </form>
    	
    </body>
</html>